<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动Bug问题</title>
		<link rel="stylesheet" href="css/浮动bug.css" />
	</head>
	<body>
		<!-- 浮动  元素一旦浮动起来，页面由元素之间嵌套形成 
		 float属性一定会浮动Bug,
		 主要Bug两个: 1.浮动塌陷: 具备元素一定嵌套，父元素没有指定高度，子元素浮动
		                        问题：父元素没有高度，子元素浮动，父元素塌陷
								解决措施： 1.找到塌陷父级元素，指定高度。靠经验加数值
								          2.找到塌陷父级元素，指定溢出，
										  给父元素加overflow:hidden(超出部分隐藏)，
										  子元素当高度隐藏     推荐
		             2.浮动不够卡动： 父级元素宽度不够，某个子元素【高度】超过其他元素
					     解决措施：1.找到父级元素，看需求加宽【横向显示】√，看需求加高【纵向显示】经验
								  2.找到异常元素【卡住元素】，清除浮动  推荐
		 -->
		 <div id="father">
		 	<div class="d1">1</div>
		 	<div class="d2">2</div>
		 	<div class="d3">3</div>
		 	<div class="d4">4</div>
		 	<div class="d5">5</div>
		 </div>
	</body>
</html>